{% extends base_template %}
{% load i18n xadmin_tags %}

{% load crispy_forms_tags %}

{% block extrastyle %}{{ block.super }}
    <link rel="stylesheet" href="{% static "xadmin/css/login-" %}{{ bg_index }}.css" type="text/css"/>
{% endblock %}

{% block body %}
    <div class="cont">
        <div class="demo">
            <form id="login-form" action="" method="post">
                <div class="login__logo">
                    <img alt="logo" src="{% static "xadmin/img/logo.png" %}" width="200" height="122">
                </div>
                <div class="login__check"><br/>{{ title }}<br/></div>
                {% csrf_token %}
                {% block login_form %}
                    <div id="panel-login" class="login__form">
                        {% view_block 'form_top' %}
                        {# {% include 'bootstrap3/errors.html' %}#}
                        <div id="div_id_username" class="login__row">
                            <svg class="login__icon name svg-icon" viewBox="0 0 20 20">
                                <path d="M0,20 a10,8 0 0,1 20,0z M10,0 a4,4 0 0,1 0,8 a4,4 0 0,1 0,-8"></path>
                            </svg>
                            <label for="id_username"></label>
                            <input type="text" class="login__input" id="id_username" name="username"
                                   placeholder="{% trans "Username" %}" autocomplete='off'>

                            {% for error in form.username.errors %}
                                <p id="error_{{ forloop.counter }}_{{ field.auto_id }}"
                                   class="text-danger help-block">{{ error }}</p>
                            {% endfor %}
                        </div>
                        <div id="div_id_password" class="login__row">
                            <svg class="login__icon pass svg-icon" viewBox="0 0 20 20">
                                <path d="M0,20 20,20 20,8 0,8z M10,13 10,16z M4,8 a6,8 0 0,1 12,0"></path>
                            </svg>
                            <label for="id_password"></label>
                            <input type="password" class="login__input" id="id_password" name="password"
                                   placeholder="{% trans "Password" %}" autocomplete='off'>

                            {% for error in form.password.errors %}
                                <p id="error_{{ forloop.counter }}_{{ field.auto_id }}"
                                   class="text-danger help-block">{{ error }}</p>
                            {% endfor %}
                        </div>
                        <input type="hidden" name="this_is_the_login_form" value="1"/>
                        <input type="hidden" name="next" value="{{ next }}"/>
                        <button type="submit" class="login__submit">{% trans 'log in' %}</button>
                        {#                        {% view_block 'form_bottom' %}#}
                        <div class="registration" style="color:#F5FFFA">
                            创建账号或找回密码请联系QQ
                            <a target="_blank" style="color:#00CCFF"
                               href="http://wpa.qq.com/msgrd?v=3&amp;uin=123456&amp;site=qq&amp;menu=yes"
                               alt="点击这里给我发消息" title="点击这里给我发消息">123456</a>
                        </div>
                    </div>
                {% endblock %}
            </form>
        </div>
    </div>

    <script type="text/javascript">
        document.getElementById('id_username').focus()
    </script>
{% endblock %}
